//走马灯
var marquee = Class.create({
	offset_width : 0,
	list_flag : 0,
	box_id : '',
	reset_box_id : '',
	list_width : '',
	length : '',
	step : '',
	speed : 30,
	stoptime : 3000,
	marquee_flag : '',
	pauseTimer : '',
	/**
	* 初始化走马灯 
	*
	* @param box_id			int	#容器id
	* @param reset_box_id	int #备份容器
	* @param count			int #单元宽度
	* @param direction		int #方向
	* @param speed			int #速度
	* @param stoptime		int #停顿时间
	* @param step			int #步长
	**/
	initialize : function(box_id,reset_box_id,list_width,count,direction,speed,stoptime,step){
		this.box_id = box_id;
		this.reset_box_id = reset_box_id;
		this.list_width = list_width;
		this.length = count * this.list_width;
		this.speed = speed;
		this.stoptime = stoptime;
		this.step = step;
//		this.pause();
	},
	pause : function(){
		var self = this;
		clearInterval(self.marquee_flag);
		clearTimeout(self.pauseTimer);
	},
	play : function(){
		var box = $(this.box_id);
		var _this = this;
		clearTimeout(_this.pauseTimer);
		if(this.offset_width > -this.length){
			if(-this.offset_width == (this.length - this.list_width*2)){
				box.insert($(this.reset_box_id).innerHTML.replace(/%7E/g,'~'));
			}
			if(this.offset_width % -this.list_width == 0 && this.offset_width!=0 && this.list_flag == 0){
				clearInterval(this.marquee_flag);
				this.list_flag =1;
				var newPlay = this.play.bindAsEventListener(this);
				this.pauseTimer = setTimeout(function(){_this.marquee_flag = setInterval(newPlay,_this.speed)},this.stoptime);
			}else{
				this.list_flag = 0;
				this.offset_width -= this.step;
				box.style.marginLeft = this.offset_width + 'px';
			}
		}else{
			if(this.offset_width == -this.length){
				clearInterval(this.marquee_flag);
				this.reset();
				var newPlay = this.play.bindAsEventListener(this);
				this.pauseTimer = setTimeout(function(){_this.marquee_flag = setInterval(newPlay,_this.speed)},this.stoptime);
			}
		}
	},
	reset : function(){
		this.list_flag = 0;
		this.offset_width = 0;
		$(this.box_id).style.marginLeft = 0 + 'px';
		$(this.box_id).update();
		$(this.box_id).insert($(this.reset_box_id).innerHTML.replace(/%7E/g,'~'));
	}
});

var ImageRoller = Class.create();

Object.extend(ImageRoller.prototype, {
	images: [],				// roll images, use html @id	图片ID(数组传入)
	links: [],				// links						连接ID(数组传入)
	titles: [],				// titles						标题(数组传入)
	description: [],		// description					描述(数组传入)
	frame: '',				// wrap frame					相框id
	EnterArtical: null,		// current links				当前图片详情连接的id
	current: 0,				// current item					当前内容(索引)
	next: 0,				// next item					下一个内容(索引)
	preTipId: null,			// current item					向前一个(箭头id)
	nextTipId: null,		// next item					向后一个(箭头id)
	preTip: 0,				// current item					向前一个(索引)
	nextTip: 0,				// next item					向后一个(索引)
	sleepTime: 5,			// pause time					暂停时间
	interval: 0.5,			// animation duration			渐变时间
	alphaThreshold: 0.1,	// alpha threshold				滤镜初始化参数
	isMouseOver: false,		// if user's mouse cursor over a link?		鼠标是否停留在连接上
	isBack: false,
	iePE: null,				// if is IE time interval		是否IE
	fadeIn: null,			// a flag of fade in
	fadeOut:null,			// a flag of fade out
	pauseTimer : null,		// a flag of pause				暂停标识
	// 初始化
	initialize: function(parameters){
		Object.extend(this, parameters);
		
		var self = this;
		if($(this.EnterArtical)){
			$(this.EnterArtical).href= $(this.links[0]).href;
		}
		
		this.images.each(function(item, index){
			if(index>0){
				if(!isIE)
				{
					$(item).setOpacity(0);
				}else{
					$(item).setStyle({visibility: 'hidden'});
				}
			}
			$(item).observe(ImageFade.COMPLETE, self.playCompleteHandler.bindAsEventListener(self));
			$(item).observe(ImageFade.PROGRESS, self.playProgressHandler.bindAsEventListener(self));
			$(item).observe('click', self.clickHandler.bindAsEventListener(self));
			$(item).setAttribute('index', index);
		});
		
		this.links.each(function(item, index){
			$(item).observe("mouseover", self.forceRollHandler.bindAsEventListener(self));
			$(item).observe("widget:force", self.forceRollHandler.bindAsEventListener(self));
			$(item).setAttribute('index', index);
		});
		
//		$(this.preTipId).observe("click", self.goPre.bindAsEventListener(self));
//		$(this.preTipId).observe("mouseout", self.cancelForceRollHandler.bindAsEventListener(self));
//		$(this.nextTipId).observe("click", self.goNext.bindAsEventListener(self));
//		$(this.nextTipId).observe("mouseout", self.cancelForceRollHandler.bindAsEventListener(self));
		if(this.images.length>0){
			this.pause();
		}
	},
	startPlayIn: function(){
		if(!isIE){
			var fade = new ImageFade(this.images[this.current], ImageFade.IN, this.interval);
			fade.play();
			this.fadeIn = fade;
		}else{
			var next = ((this.current + 1)>=this.images.length)?0: this.current + 1;
			next = this.isMouseOver?this.next: next;
			var filter = ImageFade.randFilter(this.interval);
			$(this.frame).setStyle({filter : filter});
			$(this.frame).filters[0].Apply();
			$(this.images[this.current]).setStyle({visibility: 'hidden'});
			$(this.images[next]).setStyle({visibility: 'visible'});
			$(this.frame).filters[0].Play();
			this.current = next;
			
			var self = this;
			var currentMouseOver = this.isMouseOver; // save current mouse over status
			this.iePE = new PeriodicalExecuter(function(pe){
				pe.stop();
				if(!currentMouseOver){
					$(self.images[next]).fire(ImageFade.COMPLETE, {type: ImageFade.IN});
				}
			}, this.interval);
		}
		this.links.each(function(item){ $(item).removeClassName('current');});
		$(this.links[this.current]).addClassName('current');
		this.titles.each(function(item){ $(item).hide();});
		$(this.titles[this.current]).show();
		this.description.each(function(item){ $(item).hide();});
		$(this.description[this.current]).show();
		if($(this.EnterArtical))
			$(this.EnterArtical).href= $(this.links[this.current]).href;
	},
	startPlayOut: function(){
		if(this.isMouseOver && this.current == this.next){ // do not handle
			return;
		}
		if(!isIE){
			var fade = new ImageFade(this.images[this.current], ImageFade.OUT, this.interval);
			fade.play();
			this.fadeOut = fade;
		}else{
			this.startPlayIn();
		}
	},
	playCompleteHandler: function(event){
		event = window.event || event;
		if(event.memo.type == ImageFade.IN){
			this.pause();
		}else{
			
		}
	},
	playProgressHandler: function(event){
		event = window.event || event;

		if(event.memo.type == ImageFade.OUT && event.memo.progress==this.alphaThreshold){
			this.current++;
			if(this.current >= this.images.length){
				this.current = 0;
			}
			if(this.isMouseOver && this.next != -1){
				this.current = this.next;
			}
			this.startPlayIn();
		}
	},
	clickHandler: function(event){
//		alert($(this.links[this.current]).href);
//		window.location.href = $(this.links[this.current]).href;
		$('imgLink').href = $(this.links[this.current]).href;
	},
	pause: function(){
		var self = this;
		var currentMouseOver = this.isMouseOver;
		if(this.pauseTimer){ this.pauseTimer.stop()};
		this.pauseTimer = new PeriodicalExecuter(function(pe){
			pe.stop();
			if(!currentMouseOver){
				self.startPlayOut();
			}
		}, self.sleepTime);
	},
	forceRollHandler: function(event){
		event = window.event || event;
		this.isMouseOver = true;
 		var src = Event.element(event);
 		var index = '';
		if(src.getAttribute('index') == null){
			this.links.each(function(item, key){
				if($(item) == src.parentNode){
					index = src.parentNode.getAttribute('index');
					throw $break;
				}
			});
		}else{
			var index = src.getAttribute('index');
		}
		if(!isIE){
			this.next = index;
			try{ this.fadeIn.stop();	}catch(e){}
			try{ this.fadeOut.stop();	}catch(e){}
			this.startPlayOut();
		}else{
			try{ $(this.frame).filters[0].Stop();}catch(e){}
			this.next = index;
			this.startPlayOut();
		}
	},
	cancelForceRollHandler: function(event){
		this.isMouseOver = false;
		this.next = -1;
		this.pause();
	},
	goPre: function(event){
		var pos = (this.current - 1 < 0)? this.links.length -1: this.current - 1;
		var obj = $(this.links[pos]);
		obj.fire("widget:force");
	},
	goNext: function(event){
		this.current = parseInt(this.current);
		var pos = (this.current + 1 >= this.links.length)? 0: this.current + 1;
		var obj = $(this.links[pos]);
		obj.fire("widget:force");
	}
});


var ImageFade = Class.create();
Object.extend(ImageFade, {
	COMPLETE: "fade:complete",
	PROGRESS: "fade:progress",
	IN: "IN",
	OUT: "OUT",
	duration: 0.5,
	step: 10,
	filters: [
		'progid:DXImageTransform.Microsoft.Barn( motion=out,orientation=vertical,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Blinds( Bands=10,direction=right,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Checkerboard( Direction=right,SquaresX=10,SquaresY=10,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Fade(Overlap=1.00,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.25,wipestyle=0,motion=forward,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Inset(duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Iris(irisstyle=PLUS,motion=out,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Pixelate(MaxSquare=50,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.RadialWipe(wipestyle=CLOCK,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.RandomBars(duration=#{duration})',
		'progid:DXImageTransform.Microsoft.RandomDissolve(duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Slide(slidestyle=HIDE,Bands=1,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Spiral(GridSizeX=16,GridSizeY=16,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Stretch(stretchstyle=SPIN,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Strips(motion=leftdown,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Wheel(spokes=4,duration=#{duration})',
		'progid:DXImageTransform.Microsoft.Zigzag(GridSizeX=16,GridSizeY=16,duration=#{duration})'
	],
	randFilter: function(duration){
		var t = new Template(this.filters[Math.floor(Math.random()*1000)%this.filters.length]);
		return t.evaluate({duration: duration});
	}
});

Object.extend(ImageFade.prototype,{
	img: null,
	step: null,
	type: '',
	duration: null,
	playing: false,
	timer: null,
	current: 0,
	imgLength : 0,
	initialize: function(id, type, duration, step,imgLength){
		this.img = $(id);
		this.type = type.toUpperCase();
		this.duration = duration? duration: ImageFade.duration;
		this.step = step? step: ImageFade.step;
		if(imgLength > 0){
			this.imgLength = parseInt(imgLength);
		}
		if(this.type == ImageFade.IN){
			this.img.setOpacity(0);
		}else{
			this.img.setOpacity(1);
		}
	},
	play: function(){
		this.playing = true;
		this.timer = new PeriodicalExecuter(this.onTime.bindAsEventListener(this), this.duration/this.step);
	},
	stop: function(){
		this.playing = false;
		this.current = 0;
		this.img.setOpacity((this.type == ImageFade.IN)?1:0);
	},
	onTime: function(pe){ 	
		if(this.playing){
			var progress = this.current + 1;
			if(this.current>=this.step){
				pe.stop();
				this.play = false;
				this.img.fire(ImageFade.COMPLETE, {type: this.type});
			}else{
				this.img.setOpacity(((this.type == ImageFade.IN)?progress: (this.step - progress))/this.step);
				this.img.fire(ImageFade.PROGRESS, {progress: progress/this.step, type: this.type});
			}
			this.current++;
			
		}else{
			pe.stop();
		}
	}
});